<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>佐心，教家长做父母</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
<c:set var="ctx" value="${pageContext.request.contextPath}" />
    <link rel="stylesheet" href="assets/css/amazeui.min.css">
    <link rel="stylesheet" href="assets/css/style.css?v=2.3">
    <link rel="stylesheet" href="assets/css/index.css?v=2.3">
    <script src="assets/js/myAlert.js"></script>
    <script>
    	    /** 
     * 返回前一页（或关闭本页面） 
     * <li>如果没有前一页历史，则直接关闭当前页面</li> 
     */  
    function goBack(){  
        if ((navigator.userAgent.indexOf('MSIE') >= 0) && (navigator.userAgent.indexOf('Opera') < 0)){ // IE  
            if(history.length > 0){  
                window.history.go( -1 );  
            }else{  
                location.href="${ctx}/index.jsp";
            }  
        }else{ //非IE浏览器  
            if (navigator.userAgent.indexOf('Firefox') >= 0 ||  
                navigator.userAgent.indexOf('Opera') >= 0 ||  
                navigator.userAgent.indexOf('Safari') >= 0 ||  
                navigator.userAgent.indexOf('Chrome') >= 0 ||  
                navigator.userAgent.indexOf('WebKit') >= 0){  
      
                if(window.history.length > 1){  
                    window.history.go( -1 );  
                }else{  
                    location.href="${ctx}/index.jsp";
                }  
            }else{ //未知的浏览器  
                window.history.go( -1 );  
            }  
        }  
    }  
    </script>
</head>
<body class="bg-gray">
<header data-am-widget="header" class="am-header am-header-default am-header-fixed am-border-bottom">
    <div class="am-header-left am-header-nav">
        <a  onclick="goBack();"  >
            <i class="icon_8"></i>
        </a>
    </div>
    <h1 class="am-header-title">
        培训购买
    </h1>

    <div class="am-header-right am-header-nav">
        <a id="btnfeedback">
            <i class="icon_63"></i>
        </a>
    </div>
</header>
<section class="am-padding-bottom-sm" id="amz-main" data-tag="css-nav">
    <div class="bg-white am-padding-top-sm am-padding-bottom-sm">
    <div class="am-container  font-14 font-color-13">
      <div class="padding-left-20 prelative">  <i class="small_star_1"></i>烦请认真填写，“佐心科技”将尽快联系您</div>
    </div>
    <div class="report_item bg-gray am-margin-left-sm am-margin-right-sm am-margin-top-sm">
        <div class="am-g   am-padding-top-sm   am-padding-bottom-sm">
            <div class=" am-u-sm-12 am-list-main font-color-13 box">
                <i class="icon_12"></i>
                <div class="width-50px">
                    <div class="icon_9-1"></div>
                    <div class="line-1">
                        <i class="circle-1"></i>
                    </div>
                    <div class="line-2">
                        <i class="circle-1"></i>
                    </div>
                </div>
                <div class="box-1">
                    <div class="am-list-item-hd font-color-main am-padding-top-sm">
                        培训标题： ${study.studyTitle}
                    </div>
                    <div class="font-14  margin-top-10">
                       培训时间：${study.startStudyStr}
                    </div>
                    <div class="font-14  margin-top-10 am-padding-bottom-xs">
                        培训价格：${study.studyPrice}
                    </div></div>
            </div>

            <div class="am-u-sm-12  font-14 am-margin-top-xs ">
                <div class="bd-phone-div prelative">
                    <i class="small_star"></i>
                    <input type="text"  id="customerName" placeholder="请输入您的姓名">
                </div>
            </div>
            <div class="am-u-sm-12  font-14 am-margin-top-sm ">
                <div class="bd-phone-div prelative">
                    <i class="small_star"></i>
                    <input type="tel"  id="telephone" placeholder="请输入您的联系方式">
                </div>
            </div>

        </div>
    </div>
    </div>

    <!--付款方式-->
    <div class="bg-white am-margin-top-sm am-padding-bottom-sm">
        <div data-node="pay_type"  class="am-list-news am-list-news-default  am-margin-bottom-xs font-color-13">

            <div class="am-list-news-bd">
                <ul class="am-list">

                    <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left padding-li-3 type">

                        <div class=" am-u-sm-11 am-list-main">
                            <div class="box">
                            <div class="width-40px ">
                                <img class="img-30" src="assets/images/icon/public/icon_10.png"/>
                            </div>
                                <div class="box-1">
                                <h3 class="am-list-item-hd padding-top-3">
                                    微信支付
                                </h3>
                                </div>
                            </div>

                        </div>
                        <div class=" am-u-sm-1 ">
                            <div class="icon-gouxuan cur"></div>
                        </div>
                    </li>
                    <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left padding-li-3 type">
                        <div class=" am-u-sm-11 am-list-main">
                            <div class="box">
                                <div class="width-40px ">
                                    <img class="img-30" src="assets/images/icon/public/icon_11.png"/>
                                </div>
                                <div class="box-1">
                                    <h3 class="am-list-item-hd padding-top-3">
                                        银行卡绑定
                                    </h3>
                                </div>
                            </div>

                        </div>
                        <div class=" am-u-sm-1 ">
                            <div class="icon-gouxuan "></div>
                        </div>
                    </li>

                </ul>
            </div>
        </div>

        <div class="am-padding-left-sm am-padding-right-sm font-14 font-color-13 am-margin-top-sm ">
            <div class="bg-gray am-padding-sm">
            <span class="padding-left-30 prelative"><i class="icon_7"></i>温馨提示：您购买的收费项目，完成支付后，请耐心等待活动发起人审核。若审核不通过，将会全额退款。</span>
            </div>
        </div>

        <div class="am-container am-margin-top-sm">
            <div class="btn-4 word-space-2 padding-left-0" onclick="addOrder()">确定</div>
        </div>

    </div>



</section>

<div class="am-modal am-modal-prompt" tabindex="-1" id="my-prompt">
    <div class="am-modal-dialog">
        <div class="am-modal-hd">问题反馈</div>
        <div class="am-modal-bd">
            <textarea rows="3" class="mark_content am-modal-prompt-input" placeholder="对本产品有什么建议，敬请告知，谢谢！"></textarea>
        </div>
        <div class="am-modal-footer">
            <span class="am-modal-btn" data-am-modal-cancel>取消</span>
            <span class="am-modal-btn" data-am-modal-confirm>提交</span>
        </div>
    </div>
</div>


<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<script>
    $(function () {
        $('#btnfeedback').on('click', function () {
            $('#my-prompt').modal({
                relatedTarget: this,
                onConfirm: function (e) {
                    if(""==e.data){
                		myAlert("请输入意见或建议，谢谢");
                		return false;
                	}
                    var gotoTuCao=$.ajax({url:"${ctx}/gotoTuCao?content="+e.data,async:false});
				    var gotoTuCaoJson=JSON.parse(gotoTuCao.responseText);
				    if(gotoTuCaoJson.resultCode=="0"){
				    	myAlert("感谢您的热心回馈，谢谢");
				    }
                },
                onCancel: function (e) {
//                    alert('不想说!');
                }
            });
        });
    });
</script>
<script>


    $("[data-node='pay_type']").find(" li.type").click(function () {
        $("[data-node='pay_type']").find(" li.type .icon-gouxuan").removeClass("cur");
        $(this).find(".icon-gouxuan").addClass("cur");
    });
    
    function addOrder(){
	    //addOrder?
	    var payMenthod="wei_pay";
	    var orderType=3;
	    
	    var customerName=$("#customerName").val();
	    var telephone=$("#telephone").val();
	    
	   	if(customerName==""){
	   		myAlert("请您填写联系人姓名,谢谢");
	   		return false;
	   	}
	   	if(telephone==""){
	   		myAlert("请您填写联系人电话,谢谢");
	   		return false;
	    }
	    
	    var reg = /^0?1[3|4|5|6|7|8][0-9]\d{8}$/;
	    var reg2 = /^0\d{2,3}-?\d{7,8}$/;
    	if (!reg.test(telephone) && !reg2.test(telephone)){
	      myAlert("请输入正确的联系方式");
	      return false;
	 	}
	   	var studyId=${study.id};
   		location.href="addOrder?studyId="+studyId+"&payMenthod="+payMenthod+"&orderType="+orderType+"&customerName="+customerName+"&telephone="+telephone;
    }

</script>
</body>
</html>